Share native and plugin question forms with compact interaction UI - #3147

Human comments

What was wrong

Built-in questions and the ask-user-question plugin duplicated their form UI, state, and shortcut handling. Their containers also diverged: built-in prompts had an orange border and collapse controls while plugin forms used a neutral border without collapse controls. Compact permission prompts wrapped across multiple lines on mobile.

What changed

• Use one PendingInteractionShell for built-in questions, approvals, plan reviews, and plugin forms: neutral border, attention dot, title/caret disclosure controls, and a single-line compact mobile layout.
• Use one QuestionForm and answer-state implementation for built-in and plugin questions, including tabs, single/multiple selection, Other/free text, validation, navigation, and option previews. Delete the duplicate implementations and consolidate form tests.
• Keep small transport adapters: built-in questions submit a user_answer resolution and cancellation stops the thread; the plugin submits {answers} and retains its interaction cancellation behavior.
• Route both forms through the app's configured question shortcuts, limited to the focused pane. Collapsing pauses shortcut effects while preserving draft text, selections, and the active question. Typing in an input does not select answers.
• Share the internal question-host React context across plugin bundles through a runtime shim. No public Plugin SDK, CLI, or server/daemon wire changes.
• Title taps toggle the form; approval actions remain separate controls in the expanded form. Escape collapses and restores focus. Attention-dot policy is unchanged by the form refactor.

How you verified

• App: 50 targeted tests passed across shared form/state, native adapter/shell, plugin composer, shortcuts, and runtime installation. The native adapter regression also checks the submitted resolution and thread cancellation.
• Ask-user-question plugin: 30 tests passed, including submission, cancellation, invalid payloads, server behavior, and translation.
• Plugin build: 11 tests passed, including a bundled-module check that the question-host hook uses the host runtime instance.
• pnpm exec turbo run typecheck lint --filter=@bb/app --filter=@bb/shared-ui --filter=bb-plugin-ask-user-question --filter=@bb/plugin-build passed. Formatting and diff checks passed.
• Dev-browser against native and actual plugin-source Ladle fixtures: desktop selections, multiselect/free text, mobile single-line collapse, title-tap expansion, and retained draft/current question. Earlier permission checks cover compact decisions and mobile expansion.
• Rebuilt and restarted using pnpm start:worktree; app responds HTTP 200 and the host daemon connects.
• Verification inventory has an unrelated existing failure: unmapped browser CLI family.

Screenshots

Before / After screenshot gallery — 19 surfaces/states × desktop/mobile × compact/expanded, compared with PR base 6cdb4ba612. Both columns use the same fixture data and viewport sizes; select a surface to compare it directly. Plugin forms without an earlier compact mode show their actual expanded Before view with an explicit label. Each image opens at full size.

All 38 compact captures measure 38px high with no horizontal overflow. This includes built-in and plugin questions, command/file/tool permissions, child-thread approvals, plan review, resolving requests, secrets, unavailable plugins, errors, Other answers, and free-text drafts. Compact errors use a red dot without competing with the title; expanded errors show the full message.

Compact mode now shows the short label (for example, Approval needed), dot, and caret; details, source links, and decisions appear after expansion. Expanded headings remain readable, with child-thread links truncating first. Attention dots align with the first line when headings wrap. All 3,935 app tests passed (3 skipped), along with typecheck and lint.

Desktop compact	Mobile compact

Desktop expanded	Mobile expanded

Browser captures use synthetic Ladle previews at 1280px and 390px viewport widths; mobile is Chromium emulation. No credentials entered. Following the compact-error change, 20 shell/controller tests, app typecheck, and lint passed.

AGENT GENERATED